export const appearDirective = {
  mounted(el, binding) {
    const observer = new IntersectionObserver(
      entries => {
        entries.forEach(entry => {
          if (entry.isIntersecting) {
            // 触发动画（通过添加 CSS 类）
            el.classList.add(binding.value || 'appear-active')
            observer.unobserve(el) // 动画触发后停止观察
          }
        })
      },
      { threshold: 0.1 } // 当元素 10% 进入视口时触发
    )
    observer.observe(el)
  },
}
